<template>
  <div>
    <button @click="star">浪起来</button>
    <button @click="end">停止</button>
    <h1>{{ msg }}</h1>
  </div>
</template>

<script>
export default {

  components: {},
  props: {},
  
  data() {
    return {
      msg: "我拿Buff，谢谢",
      intId: null,
    };
  },
  computed: {},
  watch: {},
  created() {},

  methods: {
    star() {
      if (this.intId !== null) return;

      this.intId = setInterval(() => {
        const arr = this.msg.split("");
        const arr1 = arr.splice(1, arr.length - 1);
        this.msg = arr1.concat(arr).join("");
      }, 300);
    },
    end() {
      clearInterval(this.intId);
      this.intId = null;
    },
  },
};
</script>

<style scoped></style>